<div id='cw'>
	<div class='panel'>
		<div class='panel-heading'>
			<h5>监控配置</h5>
		</div>
		<div class='panel-body'>
			<fieldset>
				<div class='row'>
					<div class='col-xs-10'>
						<div class='row'>
							<div class='col-xs-12'>
								<div class='form-group group-inline'>
									<label>
										<i class='required'></i>
										选择监控项：
									</label>
									<ng-select data-option='serviceOption.option' data-data='serviceOption.data'></ng-select>
								</div>
							</div>
						</div>
						<form id='device-service-form'>
							<fieldset ng-if='serviceOption.data && !createServiceHandler.hasInstance'>
								<legend>
									<h5 class='pull-left'>监控项配置</h5>
								</legend>
								
								<div>
									<h5>告警配置</h5>
									<ng-data-input data-fields='deviceServiceMeta.alertFields' data-data='deviceServiceMeta.data'></ng-data-input>

									<h5>参数配置</h5>
									<ng-data-input data-fields='deviceServiceMeta.paramFields' data-data='deviceServiceMeta.data.params'></ng-data-input>
									<div class='text-right'>
										<a href='javascript:;' class='btn btn-info'>测试</a>
										<a href='javascript:;' class='btn btn-primary' name='positive-btn'>保存</a>
									</div>
								</div>
								
							</fieldset>
						</form>
						<fieldset ng-if='serviceOption.data && createServiceHandler.hasInstance'>
							<legend>
								<h5 class='pull-left'>实例管理</h5>
								<div class='pull-right'>
									<a href='javascript:;' class='btn btn-info btn-xs'>扫描实例</a>
									<a href='javascript:;' class='btn btn-primary btn-xs'>新增实例</a>
								</div>
							</legend>
							
							<ng-datatable data-setting='deviceServiceInstanceTable.setting' data-table='deviceServiceInstanceTable.table'  data-search-param='deviceServiceInstanceTable.searchParam' id='datatable-list'></ng-datatable>
							<div class='pull-right'>
								<a href='javascript:;' class='btn btn-primary'>保存数据</a>
							</div>
						</fieldset>
					</div>
				</div>
				<!-- <div style='line-height:35px;background-color:#eee;text-align:center;cursor:pointer' title='新增实例'>
					<i class='glyphicon glyphicon-plus'>新增实例</i>
				</div> -->
			</fieldset>
		</div>
	</div>

	<!-- 新增实例表单 -->
	<div class="modal fade" id='instance-create-modal' tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog" style='width:800px'>
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" 
							aria-hidden="true">×
					</button>
					<h4 class="modal-title" >
						{{createForm.title}}
					</h4>
				</div>
				<div class="modal-body">
					<form id='instance-create-form'>
						<ng-data-input data-fields='createForm.fields' data-data='createForm.data'></ng-data-input>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" name='close-btn' class="btn btn-default" 
							data-dismiss="modal">取消
					</button>
					<button type="button" name='positive-btn' class="btn btn-primary">
						保存
					</button>
				</div>
			</div>
		</div>
	</div>
	<!-- #新增实例表单 -->
</div>